import { movieApi } from '@/api/graph/chart'
import G6 from '@antv/g6'

export interface ChartOptions {}

class Chart {
  readonly version: string = '0.0.1'
  readonly graph: any

  constructor(cfg) {
    // 画布容器属性
    const clientRect = cfg.container.getBoundingClientRect()

    this.graph = new G6.Graph({
      ...cfg,
      defaultEdge: {
        style: {
          stroke: '#ccc',
          lineWidth: 3,
          lineAppendWidth: 5,
          endArrow: true,
        },
        labelCfg: {
          autoRotate: true,
        },
      },
      layout: {
        type: 'force',
        center: [clientRect.width / 2, clientRect.height / 2],
        linkDistance: 240,
        nodeStrength: -260,
      },
      modes: {
        default: ['zoom-canvas', 'drag-canvas', 'drag-node'],
      },
    })
  }

  render(data) {
    G6.Util.processParallelEdges(data.edges)
    this.graph.data(data)
    this.graph.render()
  }
}

export function useChart(cfg) {
  return new Chart(cfg)
}

/**
 * 数据转换
 * @param param0
 */
export function convertData({ graphView, graphORM, graphData }) {
  console.log({ graphView, graphORM, graphData })

  // 图样式数据
  const viewMap = new Map()
  graphView.nodes.forEach((d) => viewMap.set(d.label, d))
  graphView.edges.forEach((d) => viewMap.set(d.label, d))

  // 图映射数据
  const ormMap = new Map()
  graphORM.forEach((d) => ormMap.set(d.modelType, d))

  const nodes = graphData.nodes.map((d) => {
    const orm = ormMap.get(d.label)
    const view = viewMap.get(orm.graphType)

    return {
      id: d.id,
      type: view.type,
      label: d.properties[orm.label],
      size: view.size,
      style: view.style,
      labelCfg: view.labelCfg,
      x: Math.random() * 1960,
      y: Math.random() * 980,
      '@graphType': orm.graphType,
      '@modelType': orm.modelType,
      properties: d.properties,
    }
  })

  const edges = graphData.edges.map((d) => {
    const orm = ormMap.get(d.label)
    const view = viewMap.get(orm.graphType)

    return {
      id: d.id,
      source: d.source,
      target: d.target,
      label: d.properties[orm.label],
      labelCfg: view.labelCfg,
      '@graphType': orm.graphType,
      '@modelType': orm.modelType,
      properties: d.properties,
    }
  })

  return { nodes, edges }
}
